<template>
    <div>
        <Sider hide-trigger :style="{position: 'fixed', height: '100vh', left: 0, overflow: 'auto'}">
            <Menu :active-name="activeName" theme="dark" width="200px" :open-names="['main']">
                <Submenu :name="item.id" v-for="(item, index) in menus" :key="index">
                    <template slot="title">
                        <Icon type="ios-navigate"></Icon>
                        {{item.name}}
                    </template>
                    <!-- :to="item2.link" -->
                    <MenuItem :name="item2.id" v-for="(item2, index2) in item.children" :key="index2" :to="'/main'+item2.link">
                        {{item2.name}}
                    </MenuItem>
                    
                </Submenu>
            </Menu>
        </Sider>
    </div>
</template>

<script>
import leftMenu from '@/utils/left-menu'
export default {
    name:"LeftMenu",
    mounted() {
        console.log(this.$router.options.routes[2].children);
    },
    data() {
        return {
            menus:leftMenu,
            activeName:this.$store.state.leftMenuCheckd
        };
    },
    components: {},
    methods:{
        toLink(item){
            // console.log(this.$route);
            // let that = this;
            // this.$router.push({
            //     path:that.$route.path+item.link
            // })
        }
    },
};
</script>

<style>
</style>
